import React, {Component} from 'react';
//import pureRender from 'pure-render-decorator';
import {History, Link } from 'react-router';
import { connect } from 'react-redux';
import { ClearanceGet } from '../Redux/Actions/clearanceAction';
import { is, fromJS} from 'immutable';
import {Imglist} from './common/img';
import {UctToLocaltime} from '../Config/Util';


class Clearance extends Component {
    constructor() {
        super();
        this.state = {
            
        }
    }

    componentWillMount(){
        const token = this.props.authReducer.user.data.token;
        const orderId = this.props.location.state.orderId;
        this.props.dispatch(ClearanceGet(token,orderId));
    }

    shouldComponentUpdate(nextProps, nextState) {
        return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state),fromJS(nextState))
    }
   
    render() {
        document.title="报关";
        const clearance = this.props.clearanceReducer.clearance.data;
        if(clearance != undefined){
            return (
                <div className="main-wrap bg-grey">
                    <div className="me-info">
                        <p className="info-title">换单<span className="icon iconfont icon-xiala pull-right"></span></p>
                        <ul className="infoList">
                            <li>
                                <span>换单时间</span> <span>{UctToLocaltime(clearance.changeBillTime)}</span>
                            </li>
                        </ul>

                        <p className="info-title">拆箱<span className="icon iconfont icon-xiala pull-right"></span></p>
                        <ul className="infoList">
                            <Imglist src={clearance.openBoxUrl} alt="拆箱照片"/>
                        </ul>

                        <p className="info-title">出税<span className="icon iconfont icon-xiala pull-right"></span></p>
                        <ul className="infoList">
                            <li>
                                <span>是否出税</span> <span>{clearance.isSetTax==true?"是":"否"}</span>
                            </li>
                            <li>
                                <span>是否垫税</span> <span>{clearance.isPadTax==true?"是":"否"}</span>
                            </li>
                            <li>
                                <span>是否立即出税</span> <span>{clearance.isPopTax==true?"是":"否"}</span>
                            </li>
                            <Imglist src={clearance.padTaxUrl} alt="打款回单照片"/>
                            <Imglist src={clearance.taxBillUrl} alt="税单照片"/>
                        </ul>

                        <p className="info-title">海关放行<span className="icon iconfont icon-xiala pull-right"></span></p>
                        <ul className="infoList">
                            <li>
                                <span>放行时间</span> <span>{UctToLocaltime(clearance.customsClearanceTime)}</span>
                            </li>
                        </ul>

                        <p className="info-title">整改<span className="icon iconfont icon-xiala pull-right"></span></p>
                        <ul className="infoList">
                            <li>
                                <span>整改时间</span> <span>{UctToLocaltime(clearance.rectificationTime)}</span>
                            </li>
                        </ul>

                        <p className="info-title">车辆检测线<span className="icon iconfont icon-xiala pull-right"></span></p>
                        <ul className="infoList">
                            <li>
                                <span>预计时间</span> <span>{UctToLocaltime(clearance.estimatedTime)}</span>
                            </li>
                            <li>
                                <span>实际时间</span> <span>{UctToLocaltime(clearance.actualTime)}</span>
                            </li>
                        </ul>

                        <p className="info-title">入库<span className="icon iconfont icon-xiala pull-right"></span></p>
                        <ul className="infoList">
                            <li>
                                <span>车库名称</span> <span>{clearance.garageName}</span>
                            </li>
                            <li>
                                <span>车库地点</span> <span>{clearance.garageAddress}</span>
                            </li>
                            <li>
                                <span>看车人姓名</span> <span>{clearance.viewCarManName}</span>
                            </li>
                            <li>
                                <span>看车人身份证</span> <span>{clearance.viewCarManIdentity}</span>
                            </li>
                            <li>
                                <span>看车人电话</span> <span>{clearance.viewCarManPhone}</span>
                            </li>
                            <li>
                                <span>提车人姓名</span> <span>{clearance.pickCarManName}</span>
                            </li>
                            <li>
                                <span>提车人身份证</span> <span>{clearance.pickCarIdentity}</span>
                            </li>
                            <li>
                                <span>提车人电话</span> <span>{clearance.pickCarManPhone}</span>
                            </li>
                            <li>
                                <span>预约看车日期</span> <span>{UctToLocaltime(clearance.appointmentViewCarTime)}</span>
                            </li>
                            <li>
                                <span>是否当日看车</span> <span>{clearance.isPickCarDenges==true?"是":"否"}</span>
                            </li>
                        </ul>
                    </div>

                </div>
            )
        }else{
            return <div></div>
        }
    }
}


export default connect((state) => {
    const { authReducer,clearanceReducer } = state;
    return {
        authReducer,clearanceReducer
    }
})(Clearance);